/**
 * @Author:周邱艳
 * @Date:2020/7/4
 * @Description:这是持仓列表页
 */
import React,{Component} from "react";
import {Card, Icon, NavBar, WhiteSpace} from "antd-mobile";
import axios from "axios";
import {getCookieId} from "../Login/Component_Login/GetCookie";
import HoldingCard from "./HoldingList_Component/HoldingCard";
import {Link} from "react-router-dom";

export default class HoldingList extends Component{
    constructor(props) {
        super(props);
        this.state={
            positionList:[]//json表名
        }
        this.loadData = this.loadData.bind(this)
        this.handleLeftClick = this.handleLeftClick.bind(this)
    }
    handleLeftClick(event){
        localStorage.setItem("tabs",2)
        this.props.history.push('/terran/my')
    }
    loadData(){
        axios({
            method:"GET",
            url:"http://39.101.141.248:9527/wealthAccount/showWealthAccountList",
            params:{userId:getCookieId()}//this.props.userId,this.props.tradeId
        }).then(res=>{
            console.log(res.data.positionList)
            this.setState({
                positionList:res.data.positionList,
            })
        }).catch(error =>{
            console.log(error)
        })
    }
    componentDidMount() {
        this.loadData()
    }
    render() {
        return (
            <div>
                {/*页面顶部*/}
                <div style={{position:"fixed",width:"100%",zIndex:999}}>
                <NavBar
                    mode="light"
                    icon={<Icon type="left" style={{color:" #f8a83f"}} />}
                    onLeftClick={this.handleLeftClick}

                >持仓列表</NavBar>
                </div>
                <WhiteSpace/>
                <WhiteSpace/>
                <WhiteSpace/>
                <WhiteSpace/>
                <WhiteSpace/>
                <WhiteSpace/>
                {/*持仓金额相关*/}
                <HoldingCard/>
                {/*持仓明细*/}
                <div>
                    <Card>
                        <Card.Header
                            title="持仓明细"
                        />
                        <Card.Body>
                            {(()=>{return this.state.positionList.map((item,index)=>{
                                return(
                                    <div>
                                        <Card>
                                            <Card.Header
                                                title={item.comName}
                                                extra={<Link to={{pathname:"/holdingListDetail",state:{accountId:item.accountId}}} style={{color:"blue"}}> 查看详情</Link>}
                                            />
                                            <Card.Body>
                                                <div className="data1">
                                                    <div style={{width:"10%",float:"left"}}></div>
                                                    <div className="data2">
                                                        <p style={{fontSize:"15px",color:"grey",marginTop:"0.25rem"}}>
                                                            持仓金额

                                                        </p>
                                                        <p style={{fontSize:"15px",color:"#f8a83f"}}>{item.totalMoney}</p>
                                                    </div>

                                                    {/*<div className="data2">
                                                        <p style={{fontSize:"15px",color:"grey",marginTop:"0.25rem",marginLeft:"2rem"}}>
                                                            累计收益

                                                        </p>
                                                        <p style={{fontSize:"15px",color:"#f8a83f",marginLeft:"2rem"}}>{item.totalEarning}</p>
                                                    </div>*/}
                                                    <div className="data2">
                                                        <p style={{fontSize:"15px",color:"grey",marginTop:"0.25rem",marginLeft:"2rem"}}>
                                                            昨日收益
                                                        </p>
                                                        <p style={{fontSize:"15px",color:"#f8a83f",marginLeft:"2rem"}}>{item.yesterdayEarning}</p>
                                                    </div>
                                                </div>
                                            </Card.Body>
                                        </Card>
                                    </div>
                                )
                            })
                            })()}
                        </Card.Body>
                    </Card>

                </div>

            </div>
        );
    }
}
